<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人中心</title>
    <meta name="keywords" content="芈小兔教学平台,科学芈盒教学平台">
    <meta name="description"
        content=" “科学芈盒”品牌由北京芈小兔教育科技有限公司创立,以“反对填鸭教学,主张不教的教育”为教育理念,致力于为全国教育培训机构及学校提供幼少儿STEAM教育解决方案。">
    <link rel="icon" href="./images/MIXIAOTU.png" type="image/x-icon">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/public.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/swiper.min.css">
    <link rel="stylesheet" href="./css/personalCenter.css">
</head>

<body>
    <!-- 头部 -->
    <header class="header screenFullNone">
        <div class="container">
            <div class="Hleft">
                <a href="index.html">
                    <img src="./images/courseware/科学小伙伴@2x.png" alt="logo科学小伙伴">
                    <!-- <p id="logoText"></p> -->
                </a>
            </div>
            <div class="Hright">
                <div id="infomation"><img src="./images/courseware/tixing@2x.png" alt="tixing"></div>
                <div id="tabOrganization">
                    <div class="showKXXHB">
                        <span>科学小伙伴</span>
                        <img src="./images/courseware/headerTaborganization.png" alt="">
                    </div>
                    <div class="pullDownList">
                        <!-- 下拉 -->
                        <div id="listBox">
                            <ul>
                                <!-- <li>摩尔思维编程</li> -->
                            </ul>
                        </div>

                        <a href="./joinOrgan.html"><img src="./images/lanjia.png"
                                alt=""><span>加入机构</span></a>
                    </div>
                </div>
                <button id="ruzhurenzheng">机构认证</button>
                <p class="logAfterHide">登录/注册</p>
                <div class="loginAfter dn">
                    <!-- <img src="./images/courseware/blue.png" alt=""> -->
                    <div class="enterLogin dn">
                        <a href="./personalCenter.html">
                            <p><img src="./images/courseware/personInfo.png" alt="personInfo">账号管理</p>
                        </a>
                        <p id="userExit"><img src="./images/courseware/tuichu.png" alt="tuichu">安全退出</p>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <!-- 返回精品课程按钮 -->
    <div class="conTitle">
        <div class="container">
            <div class="titleInfo">
                <a href="./index.html">
                    <p>返回精品课程</p>
                </a>
            </div>
        </div>
    </div>
    <!-- 用户信息 -->
    <div class="userinfoCon">
        <div class="container">
            <div class="userinfoOpt">
                <div class="flexAdd">
                    <div id="userImg">
                        <img src="" id="headPic" alt="touxiang">
                    </div>
                    <ul>
                        <li>
                            <span>用户名</span>
                            <input type="text" readonly unselectable="on" value="MIUMIU" id="nickname">
                            <img class="hoverModi" id="dislogUsername" src="./images/personalXIugai.png" alt="用户名">
                        </li>
                        <li>
                            <span>手机号</span>
                            <input type="text" readonly unselectable="on" value="17690872079" id="mobile">
                            <img class="hoverModi" id="dislogTel" src="./images/personalXIugai.png" alt="用户名">
                        </li>
                        <li>
                            <span>微信</span>
                            <input type="text" readonly unselectable="on" value="未绑定">
                            <i id="dislogUnbind">绑定</i>
                        </li>
                        <li>
                            <span>密码</span>
                            <input type="password" readonly unselectable="on" value="1231">
                            <img class="hoverModi" id="dislogPwd" src="./images/personalXIugai.png" alt="用户名">
                        </li>
                    </ul>
                </div>
            </div>
            <div class="changeTel dn">
                <div class="flexAdd">
                    <h3>更换手机号</h3>
                    <input type="tel" placeholder="原手机号" id="oldMobile">
                    <input type="tel" placeholder="新手机号" id="newMobile">
                    <div class="yzm">
                        <input type="text" placeholder="验证码" id="reMobileYZM">
                        <button id="reMobileYzm">发送验证码</button>
                    </div>
                    <input type="button" value="确定" id="resetMobileBtn">
                </div>
            </div>
        </div>
    </div>  
    <!-- 修改密码弹窗 -->
    <div class="editDislog dn" id="editPwdDislog">
        <div class="centerBox">
            <h3>修改密码</h3>
            <p>密码</p>
            <input type="password" placeholder="请输入新密码" id="newPwd">
            <div class="btns">
                <button class="cancel" id="editPwdCancel">取消</button>
                <button class="confirm" id="editPwdConfirm">确定</button>
            </div>
            <img class="closeChaS" src="./images/courseware/cha2.png" alt="cha2">
        </div>
    </div>
    <!-- 修改用户名弹窗 -->
    <div class="editDislog dn" id="editNameDislog">
        <div class="centerBox">
            <h3>修改用户名</h3>
            <p>用户名</p>
            <input type="text" placeholder="MIUMIU~ \ 789819721" id="newNickname">
            <div class="btns">
                <button class="cancel" id="editNameCancel">取消</button>
                <button class="confirm" id="editNameConfirm">确定</button>
            </div>
            <img class="closeChaS" src="./images/courseware/cha2.png" alt="cha2">
        </div>
    </div>
    <!-- 修改用户名头像弹窗 -->
    <div class="editDislog dn" id="editPicDislog">
        <div class="centerBox">
            <h3>修改头像</h3>
            <p>头像地址</p>
            <input type="text" placeholder="http://img" id="newPic">
            <div class="btns">
                <button class="cancel" id="editPicCancel">取消</button>
                <button class="confirm" id="editPicConfirm">确定</button>
            </div>
            <img class="closeChaS" src="./images/courseware/cha2.png" alt="cha2">
        </div>
    </div>
    <!-- 解绑微信弹窗 -->
    <div class="unbindWx dn">
        <div class="centerBox">
            <div class="flexAdd">
                <div class="leftCon">
                    <img src="./images/unbindwx.png" alt="unbindwx">
                    <i>快捷登录</i>
                    <p>无需记住密码，微信扫码登录</p>
                </div>
                <div class="rightCon">
                    <img src="" alt="">
                    <p>微信扫码绑定</p>
                </div>
            </div>
            <img class="closeChaS" src="./images/courseware/cha2.png" alt="cha2">
        </div>
    </div>
    <!-- 提交后的弹窗 -->
    <div id="commitDialog">
        <div>
            <span id="commitAfterText">修改成功</span>
        </div>
    </div>
    <!-- 登录与注册 login 默认隐藏点击登录显示-->
    <div class="loginDialog screenFullNone dn">
        <div class="innerBox">
            <!-- 关闭弹窗按钮 -->
            <div class="close">
                <img src="./images/courseware/cha2.png" alt="关闭">
            </div>
            <img src="./images/courseware/login@2.jpg" alt="loginBackGround">
            <div class="left">
                <img src="./images/courseware/kexue.png" alt="">
                <p>欢迎回来</p>
                <p>登录一起学习吧！</p>
                <span>课件共享,在线制作,简单高效</span>
            </div>
            <div class="right">
                <h4>登录科学小伙伴</h4>
                <div class="selTitle">
                    <div class="login">
                        <p id="wxLogin">扫码登陆</p>
                        <p id="telLogin" class="active">账号登录</p>
                    </div>
                    <div class="reg dn">
                        <p id="wxZC">微信注册</p>
                        <p id="telZC" class="active">手机注册</p>
                    </div>
                    <div class="pwdReset dn">
                        <p class="active" id="telFind">
                            手机找回
                        </p>
                    </div>
                    <div class="bindWxTel dn">
                        <p class="active">绑定手机号</p>
                    </div>
                </div>
                <div class="loginMeth">
                    <!-- 手机号登录 -->
                    <div class="telLogin common">
                        <input type="text" placeholder="请输入手机号" id="logUserTel" class="userTel">
                        <div class="yanzheng">
                            <input type="text" placeholder="请输入验证码" id="logYzm" class="yzm">
                            <button id="logGetYzm">获取验证码</button>
                        </div>
                        <div class="pwdOpera">
                            <!-- <div class="memoryPwd">
                                <input type="checkbox">
                                <em>记住密码</em>
                            </div> -->
                            <i>忘记密码？</i>
                        </div>
                        <button id="logTel">登录</button>
                        <p>
                            没有账号？请<span class="regsiBtn">注册</span>
                        </p>
                    </div>
                    <!-- 手机注册 -->
                    <div class="telReg common dn">
                        <input type="text" placeholder="+86 | 手机号" id="regUserTel" class="userTel">
                        <div class="yanzheng">
                            <input type="text" placeholder="请输入验证码" id="regYzm" class="yzm">
                            <button id="getYzm">获取验证码</button>
                        </div>
                        <input type="password" placeholder="请输入密码" id="regUserPwd" class="userPwd">
                        <input type="password" placeholder="再次确认密码" id="regUserRePwd" class="twoPwd">
                        <input type="text" placeholder="请输入昵称" id="regUserName" class="userName">
                        <button id="regBtn">注册</button>
                        <strong>
                            注册即代表您同意
                            <span class="localUserAgree">《科学小伙伴用户协议》</span>
                        </strong>
                        <p>
                            已有账号？请<span class="loginBtn">登录</span>
                        </p>
                    </div>
                    <!-- wx扫描登录 -->
                    <div class="wxLogin common dn" id="wx_login">
                        <!-- <img src="./images/courseware/green.png" alt="二维码"> -->
                        <p>没有账号？请<span class="regsiBtn">注册</span></p>
                    </div>
                    <!-- wx扫描注册 -->
                    <div class="wxReg common dn" id="wx_login_reg">
                        <p>使用微信扫码注册</p>
                        <img src="./images/courseware/green.png" alt="二维码">
                        <p class="wxRegp">
                            注册即代表您同意
                            <span>《科学小伙伴用户协议》</span>
                        </p>
                        <p class="line"></p>
                        <p>已有账号？请<span class="loginBtn">登录</span></p>
                    </div>
                    <!-- 手机找回 -->
                    <div class="findTel common dn">
                        <input type="text" placeholder="+86 | 手机号" id="rePwdTel" class="userTel">
                        <div class="yanzheng">
                            <input type="text" placeholder="请输入验证码" id="rePwdYzm" class="yzm">
                            <button id="sendRePwdYzm">获取验证码</button>
                        </div>
                        <input type="password" placeholder="请输入密码" id="rePwdUserPwd" class="userPwd">
                        <input type="password" placeholder="再次确认密码" id="rePwdUserRePwd" class="twoPwd">
                        <button id="rePwdReg">提交</button>
                        <p>
                            没有账号？请<span class="regsiBtn">注册</span>
                        </p>
                    </div>
                    <div class="bindTel common dn">
                        <input type="text" placeholder="手机号" id="bindUserTel" class="userTel">
                        <div class="yanzheng">
                            <input type="text" placeholder="请输入验证码" id="bindYzm" class="yzm">
                            <button id="bindTelYzm">获取验证码</button>
                        </div>
                        <input type="password" placeholder="请输入密码" id="bindUserPwd" class="userPwd">
                        <button id="regBtn">确认绑定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="./js/jquery-1.10.1.min.js"></script>
    <script src="./js/swiper.min.js"></script>
    <script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
    <!-- <script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script> -->
    <script src="./js/commonTool.js"></script>
    <script src="./js/login.js"></script>
    <script src="./js/common.js"></script>
    <script src="./js/personalCenter.js"></script>
</body>

</html>